<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>我的购物车</title>
    <script src="商品.js"></script>
    <link rel="stylesheet" href="大作业03（分类列表页04）.css">
</head>
<body>
    <div class="shop">
        <div class="shop-li">
            <span class="all-pros">全部商品11</span>
            <div class="shop-content-top">
                <div>
                    <input type="checkbox" id="butto">
                    <label for="butto">全选</label>
                </div>
                <span>商品</span>
                <span>单价（元）</span>
                <span>数量</span>
                <span>小计（元）</span>
                <span>操作</span>
            </div>
            <div class="shop-content">
                <div class="main-top">
                    <input class="choose-inp" type="checkbox" id="choose">
                    <label for="choose" style="background-color: rgb(204, 4, 4);color: white;">传智自营</label>
                    <div class="main-top-left">
                        <span>运费：￥6.00</span>
                        <span style="color: rgb(204, 4, 4);">还差￥99.00免运费</span>
                    </div>
                    <div class="main-content-kinds">
                        <div class="kinds-li">
                            <div class="columns">
                                    <input class="choose-inp" type="checkbox">
                                    <div class="main-img">
                                        <a href="">
                                                <img class="list-img" src="大作业image/images/电商-购物车结算页_03.jpg" alt="" style="float: left;">
                                        </a>
                                                <div class="after-img">
                                                    <span class="introduce">苹果（Apple）ED463FE/A MAC </span>
                                                    <span class="introduce">Thunderbolt雷电接口 至千兆以太网转</span>
                                                    <a class="gift"><i class="gift-be"></i>购买礼品包装</a>
                                                </div>                                       
                                        
                                    </div>
                                    <div class="">
                                        <span class="introduce">
                                            尺码：Thunderbolt至千兆...
                                        </span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="priceid">248.00</span>
                                    </div>
                                    <div class="butto-li">
                                        <span class="symbol"  onclick="priceClicka()">-</span><span class="classsymbol" style="width: 30px;">1</span><span  onclick="priceClickb()" class="symbol">+</span>
                                        <br><span class="last" style="margin-left: 30px;">有货</span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="theprice">248.00</span>
                                    </div>
                                    <div class="last-box">
                                        <span href="" class="last">删除</span>
                                        <a href="" class="last">移到我的关注</a>
                                    </div>
                            </div>   
                        </div>
                        <div class="kinds-li">
                            <div style="margin-left: 10px;">
                                    <a class="list-top" href="">换购</a>
                                    <span style="color: rgb(102, 101, 101);font-size: 11px;">活动商品购满2888.00元，即可加换购商品1件></span>
                                    <span style="width: 65px;height: 20px;font-size: 11px;color: white;background-color: rgb(204, 4, 4);">查看够品</span>
                                    <a href="" style="font-size: 11px;color: rgb(102, 101, 101);">去凑单></a>
                            </div>
                            
                            <div class="columns">
                                    <input class="choose-inp" type="checkbox">
                                    <div class="main-img">
                                        <a href="">
                                                <img class="list-img" src="大作业image/images/电商-购物车结算页_06.jpg" alt="" style="float: left;">
                                        </a>
                                                <div class="after-img">
                                                    <span class="introduce">Apple MACBOOD aIR 13.3英寸笔记本电脑银色（Corei5） 处理器/8GB内存 </span>
                                                </div>                                            
                                    </div>
                                    <div class="">
                                        <span class="introduce">
                                            颜色MzcBook爱人 尺寸：13.3英寸
                                        </span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="priceid">8488.00</span>
                                    </div>
                                    <div class="butto-li">
                                        <span class="symbol">-</span><span class="classsymbol" style="width: 30px;">1</span><span class="symbol">+</span>
                                        <br><span class="last" style="margin-left: 30px;">有货</span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="theprice">8488.00</span>
                                    </div>
                                    <div class="last-box">
                                        <span href="" class="last">删除</span>
                                        <a href="" class="last">移到我的关注</a>
                                    </div>
                            </div> 
                            <div class="sand">
                                <a>[赠品]圣迪威（Sendiio）MacBook13.3寸屏幕保...  ×1</a>
                                <a>[赠品]圣迪威（Sendiio）MacBook13.3清洁套装...  ×1</a>
                            </div>
                        </div>
                        <div class="kinds-li">
                                <div class="columns">
                                        <input class="choose-inp" type="checkbox">
                                        <div class="main-img">
                                            <a href="">
                                                    <img class="list-img" src="大作业image/images/电商-购物车结算页_08.jpg" alt="" style="float: left;">
                                            </a>
                                                    <div class="after-img">
                                                            <span class="introduce">半岛铁盒移动电源A2200</span>
                                                            <span class="introduce">白色2200mah</span>
                                                            <a class="gift"><i class="gift-be"></i>购买礼品包装</a>
                                                    </div>                                            
                                        </div>
                                        <div class="">
                                            <span class="introduce">
                                                型号：A2200
                                            </span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="priceid">19.00</span>
                                        </div>
                                        <div class="butto-li">
                                            <span class="symbol">-</span><span class="classsymbol" style="width: 30px;">1</span><span class="symbol">+</span>
                                            <br><span class="last" style="margin-left: 30px;">有货</span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="theprice">19.00</span>
                                        </div>
                                        <div class="last-box">
                                            <span href="" class="last" id="remove">删除</span>
                                            <a href="" class="last">移到我的关注</a>
                                        </div>
                                </div>
                        </div>
                        <div class="kinds-li">
                                <div class="columns">
                                        <input class="choose-inp" type="checkbox">
                                        <div class="main-img">
                                            <a href="">
                                                    <img class="list-img" src="大作业image/images/电商-购物车结算页_03.jpg" alt="" style="float: left;">
                                            </a>
                                                    <div class="after-img">
                                                        <span class="introduce">苹果（Apple）ED463FE/A MAC </span>
                                                        <span class="introduce">Thunderbolt雷电接口 至千兆以太网转</span>
                                                        <a class="gift"><i class="gift-be"></i>购买礼品包装</a>
                                                    </div>                                       
                                            
                                        </div>
                                        <div class="">
                                            <span class="introduce">
                                                尺码：Thunderbolt至千兆...
                                            </span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="priceid">248.00</span>
                                        </div>
                                        <div class="butto-li">
                                            <span class="symbol">-</span><span class="classsymbol" style="width: 30px;">1</span><span class="symbol">+</span>
                                            <br><span class="last" style="margin-left: 30px;">有货</span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="theprice">248.00</span>
                                        </div>
                                        <div class="last-box">
                                            <span href="" class="last">删除</span>
                                            <a href="" class="last">移到我的关注</a>
                                        </div>
                                </div>
                        </div>
                        <div class="kinds-li">
                                <div class="columns">
                                        <input class="choose-inp" type="checkbox">
                                        <div class="main-img">
                                            <a href="">
                                                    <img class="list-img" src="大作业image/images/03-电商-产品详情页_40.jpg" width="80px"alt="" style="float: left;">
                                            </a>
                                                    <div class="after-img">
                                                        <span class="introduce">苹果（Apple）iPhone（a1586）</span>
                                                        <span class="introduce">16G 金色移动联通</span>
                                                        <a class="gift"><i class="gift-be"></i>购买礼品包装</a>
                                                    </div>                                       
                                            
                                        </div>
                                        <div class="">
                                            <span class="introduce">
                                                金色
                                            </span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="priceid">3799.00</span>
                                        </div>
                                        <div class="butto-li">
                                            <span class="symbol">-</span><span class="classsymbol" style="width: 30px;" id="symbolid">1</span><span class="symbol">+</span>
                                            <br><span class="last" style="margin-left: 30px;">有货</span>
                                        </div>
                                        <div class="">
                                            <span class="price" id="theprice">3799.00</span>
                                        </div>
                                        <div class="last-box">
                                            <span href="" class="last">删除</span>
                                            <a href="" class="last">移到我的关注</a>
                                        </div>
                                </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="shop-content" style="position: relative;top: 70px;">
                    <div class="main-top">
                            <input class="choose-inp" type="checkbox" id="choose">
                            <label for="choose" style="font-size: 14px;color: rgb(102, 101, 101);">神州数码专营店</label>
                    </div>
                    <div class="kinds-li" style="border: rgb(194, 193, 193) solid 1px;margin-top: 10px;">
                            <div style="margin-left: 10px;">
                                    <a class="list-top" href="">换购</a>
                                    <span style="color: rgb(102, 101, 101);font-size: 11px;">活动商品购满2888.00元，即可加换购商品1件></span>
                                    <span style="width: 65px;height: 20px;font-size: 11px;color: white;background-color: rgb(204, 4, 4);">查看够品</span>
                                    <a href="" style="font-size: 11px;color: rgb(102, 101, 101);">去凑单></a>
                            </div>                            
                            <div class="columns">
                                    <input class="choose-inp" type="checkbox">
                                    <div class="main-img">
                                        <a href="">
                                                <img class="list-img" src="大作业image/images/03-电商-产品详情页_35.jpg" alt="" style="float: left; width: 80px;">
                                        </a>
                                                <div class="after-img">
                                                    <span class="introduce">DELL戴尔Ins 15MR-75 28SS15英寸 银色（Corei5）处理器/8GB内存 </span>
                                                </div>                                            
                                    </div>
                                    <div class="">
                                        <span class="introduce">
                                            颜色:银色 尺寸：13.3英寸
                                        </span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="priceid">3699.00</span>
                                    </div>
                                    <div class="butto-li">
                                        <span class="symbol">-</span><span class="classsymbol" style="width: 30px;">1</span><span class="symbol">+</span>
                                        <br><span class="last" style="margin-left: 30px;">有货</span>
                                    </div>
                                    <div class="">
                                        <span class="price" id="theprice">3699.00</span>
                                    </div>
                                    <div class="last-box">
                                        <span href="" class="last">删除</span>
                                        <a href="" class="last">移到我的关注</a>
                                    </div>
                            </div> 
                            <div class="sand">
                                <a>[赠品]圣迪威（Sendiio）MacBook13.3寸屏幕保...  ×1</a>
                                <a>[赠品]圣迪威（Sendiio）MacBook13.3清洁套装...  ×1</a>
                            </div>
                        </div>
            </div>
            <div class="shop-content pay-main">
                <div class="pay-box">
                    <div class="pay-left">
                            <span>
                                    <input type="checkbox" id="pay">
                                    <label for="pay">全选</label>
                                </span>
                                <span class="span-in" id="allremove">删除选中的商品</span>
                                <span class="span-in">移到我的关注</span>
                                <span class="span-in">清除下柜商品</span>
                    </div>           
                    <div class="pay-right">
                        <span>已选择0件商品 总价（不含运费）：<span class="allprice" id="allpriceid" style="color: rgb(204, 4, 4);font-size: 17px;" value=""></span></span>
                        
                        <span style="margin-left: 160px;">已节省&nbsp;&nbsp;:<span>&nbsp;&nbsp;-￥20.00</span></span>
                        
                    </div>
                    
                </div>
                <a href="大作业03（分类列表页05）.html" class="pay-a">
                        <div class="pay-but">
                            结&nbsp;&nbsp;算
                        </div>
                    </a>
            </div>
            <div class="shop-content">
                <span style="font-size: 13px; color: rgb(44, 44, 44);">已删除商品，您可以重新购买或加关注：</span>
                <div class="yel-box">
                    <a href="" class="yel-cut">圣迪威（Sendiio）MacBook13.3清洁套...</a>
                    <span style="font-size: 14px;color: rgb(102, 101, 101);">8488.00</span>
                    <span>1</span>
                    <span>重新购买</span>
                    <span>移到我的关注</span>
                </div>
            </div>
        </div>
    </div>
</body>
</html>